<template>
    <div>
        <a-menu v-model:selectedKeys="current" mode="horizontal">
            <a-menu-item key="message">
                <router-link to="/personal/myMessage/message">信息</router-link>
            </a-menu-item>
            <a-menu-item key="comment">
                <router-link to="/personal/myMessage/comment">评论</router-link>
            </a-menu-item>
        </a-menu>
        <router-view></router-view>
    </div>
</template>

<script lang="ts">
    import { defineComponent, ref } from 'vue';
    import { MailOutlined } from '@ant-design/icons-vue';

    export default defineComponent({
        setup() {
            const current = ref<string[]>(['message']);

            const value = ref<string>('');
            const onSearch = (searchValue: string) => {
                console.log('use value', searchValue);
                console.log('or use this.value', value.value);
            };
            return {
                current,
                value,
                onSearch,
            };
        },
        components: {
            MailOutlined,
        },
    });
</script>

<style scoped>
    .demo-loadmore-list {
        min-height: 350px;
    }
</style>
